<template>
<div id="app" v-cloak>
    <!--顶部导航栏-->
    <ul class="history"
        style="width:220px; height: 500px;margin:50px 0 0 1160px;display: none; position: absolute; color: #0c73c2">
        <li id="l1" v-for="h in historys"><a :href="h.musicId"><span>{{h.name}}</span></a>
            <a :href="h.musicId"><img :src="h.face" alt=""></a>
            <a :href="h.userId"><p>UP主: {{h.userName}}</p></a>
            <a href="javascript:void(0)"><p>播放量: {{h.count}}</p></a>
            <a href="javascript:void(0)"><p>点赞数: {{h.time}}</p></a>
        </li>
        <li id="l2"><a href=""><span style="color: #3F3F3F; margin: 40px 0 0 10px;
        font-size: 17px">暂时还没有历史记录哦</span></a></li>
        <!--    <li id="l1" v-for="h in historys"><a href="跳转视频播放页面"><span theName="稿件全名">历史记录1历史记录1历史记录1历史记录1历史记录1历史记录1</span></a>-->
        <!--        <a href="跳转视频播放页面"><img src="./images/梦界head.jpg" alt=""></a>-->
        <!--        <a href="跳转用户主页"><p>UP主:</p></a>-->
        <!--        <a><p style="margin-top: -40px">播放:</p></a>-->
        <!--        <a href=""><p style="margin-top: -20px">时间:</p></a>-->
        <!--    </li>-->
        <!--        <li id="l2"><a href=""><span>历史记录2</span></a></li>-->
        <!--        <li id="l3"><a href=""><span>历史记录3</span></a></li>-->
        <!--        <li id="l4"><a href=""><span>历史记录4</span></a></li>-->
        <!--        <li id="l5"><a href=""><span>历史记录5</span></a></li>-->
    </ul>
    <div class="head_bg">
        <div class="head_meta">
            <div class="head_pic"></div>
            <div class="head_main" style="background-color: rgba(255, 255, 255, 0.4);">
                <div class="head_nav">
                    <ul class="elemList">
                        <li><a href="dreamland_home.html">首页</a></li>
                        <li><a href="#">番剧</a></li>
                        <li><a href="#">音乐</a></li>
                        <li><a href="#">关注</a></li>
                        <li style="width: 15%;"><a href="#">手机app</a></li>
                        <li><a href="#">创作</a></li>
                        <li><a href="#">推荐</a></li>
                        <li><a href="#">电影</a></li>
                    </ul>
                    <div class="head_search">
                        <form action="" class="form_search">
                            <input type="text" class="search" id="search-input">
                            <a href="#" class="b_search" id="search" @click="searchVideo"></a>
                        </form>
                    </div>
                    <!--    login-->
                    <div class="user_face">
                        <a href="dreamland_login.html"><img src="@/assets/images/梦界logo.png" alt=""></a>
                    </div>
                    <ul class="elemList elemList1">
                        <li><a href="#">设置</a></li>
                        <li><a id="myShare" href="#">动态</a></li>
                        <li id="history"><a href="#">历史</a></li>
                        <li style="width:15%;"><a href="#">创作中心</a></li>
                        <li><a href="dreamland_system.html">上传</a></li>
                        <li id="logOut"><a href="javascript:void(0)">登出</a></li>
                    </ul>
                </div>


            </div>
            <div class="logo_nav">
                <!--        create+register-->
                <div class="create_land">
                    <a href="dreamland_vip_login.html">进入梦界</a>
                </div>
                <!--    logo-->
                <div class="logo">
                    <img src="@/assets/images/梦界logo(无背景).png" alt="logo">
                </div>
            </div>


        </div>
    </div>
    <div style="height: 20px;width: 100%;"></div>
    <!--主体-->
    <div class="body_meta">
        <div class="body_main">
            <!--轮播-->
            <div class="Lunbo">
                <div id="myCarousel" class="carousel slide" style="width: 1200px;height: 300px;" data-ride="carousel">
                    <!-- 轮播（Carousel）指标 -->
                    <ol class="carousel-indicators">
                        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                        <li data-target="#myCarousel" data-slide-to="1"></li>
                        <li data-target="#myCarousel" data-slide-to="2"></li>
                    </ol>
                    <!-- 轮播（Carousel）项目 -->
                    <div class="carousel-inner">
                        <div class="item active">
                            <a :href="hotVideo3.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img3"><img
                                    :src="hotVideo3.hotPic" alt="Third slide"></a>
                            <a :href="hotVideo1.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img1"><img
                                    :src="hotVideo1.hotPic" alt="First slide"></a>
                            <a :href="hotVideo2.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img2"><img
                                    :src="hotVideo2.hotPic" alt="Second slide"></a>
                            <a :href="hotVideo1.hotUrl">
                                <div class="carousel-caption">{{hotVideo1.hotName}}</div>
                            </a>
                        </div>
                        <div class="item">
                            <a :href="hotVideo1.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img3"><img
                                    :src="hotVideo1.hotPic" alt="First slide"></a>
                            <a :href="hotVideo2.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img1"><img
                                    :src="hotVideo2.hotPic" alt="Second slide"></a>
                            <a :href="hotVideo3.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img2"><img
                                    :src="hotVideo3.hotPic" alt="Third slide"></a>
                            <a :href="hotVideo2.hotUrl">
                                <div class="carousel-caption">{{hotVideo2.hotName}}</div>
                            </a>
                        </div>
                        <div class="item">
                            <a :href="hotVideo2.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img3"><img
                                    :src="hotVideo2.hotPic" alt="Second slide"></a>
                            <a :href="hotVideo3.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img1"><img
                                    :src="hotVideo3.hotPic" alt="Third slide"></a>
                            <a :href="hotVideo1.hotUrl"
                               style="width: 500px;height: 300px;display: block;overflow: hidden" class="img2"><img
                                    :src="hotVideo1.hotPic" alt="First slide"></a>
                            <a :href="hotVideo3.hotUrl">
                                <div class="carousel-caption">{{hotVideo3.hotName}}</div>
                            </a>
                        </div>
                    </div>
                    <!-- 轮播（Carousel）导航 -->
                    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
                        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>

            </div>
            <!--    筛选-->
            <div class="body_bar">
                <ul>
                    <li><i><span>999+</span></i><a href="">首页</a></li>
                    <li><i><span>999+</span></i><a href="">动画</a>
                        <ul>
                            <li><a href=""><span>MAD·AMV</span></a></li>
                            <li><a href=""><span>MMD·3D</span></a></li>
                            <li><a href=""><span>短片·手书·配音</span></a></li>
                            <li><a href=""><span>特摄</span></a></li>
                            <li><a href=""><span>综合</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">番剧</a>
                        <ul>
                            <li><a href=""><span>连载动画</span></a></li>
                            <li><a href=""><span>完结动画</span></a></li>
                            <li><a href=""><span>资讯</span></a></li>
                            <li>
                                <a href=""><span>官方延伸</span></a></li>
                            <li>
                                <a href=""><span>新番时间表</span></a></li>
                            <li><a href=""><span>番剧索引</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="#">音乐</a>
                        <ul>
                            <li><a href=""><span>原创音乐</span></a></li>
                            <li><a href=""><span>翻唱</span></a></li>
                            <li>
                                <a href=""><span>VOCALOID·UTAU</span></a></li>
                            <li><a href=""><span>电音</span></a></li>
                            <li><a href=""><span>演奏</span></a></li>
                            <li><a href=""><span>MV</span></a></li>
                            <li><a href=""><span>音乐现场</span></a></li>
                            <li><a href=""><span>音乐综合</span></a></li>
                            <li><a href=""><span>音频</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">舞蹈</a>
                        <ul>
                            <li><a href=""><span>宅舞</span></a></li>
                            <li><a href=""><span>街舞</span></a></li>
                            <li><a href=""><span>明星舞蹈</span></a></li>
                            <li><a href=""><span>中国舞</span></a></li>
                            <li><a href=""><span>舞蹈综合</span></a></li>
                            <li><a href=""><span>舞蹈教程</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">国创</a>
                        <ul>
                            <li><a href=""><span>宅舞</span></a></li>
                            <li><a href=""><span>街舞</span></a></li>
                            <li><a href=""><span>明星舞蹈</span></a></li>
                            <li><a href=""><span>中国舞</span></a></li>
                            <li><a href=""><span>舞蹈综合</span></a></li>
                            <li><a href=""><span>舞蹈教程</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">科技</a>
                        <ul>
                            <li><a href=""><span>趣味科普人文</span></a></li>
                            <li><a href=""><span>野生技术协会</span></a></li>
                            <li><a href=""><span>演讲·公开课</span></a></li>
                            <li><a href=""><span>星海</span></a></li>
                            <li><a href=""><span>机械</span></a></li>
                            <li><a href=""><span>汽车</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">数码</a>
                        <ul>
                            <li><a href=""><span>手机平板</span></a></li>
                            <li><a href=""><span>电脑装机</span></a></li>
                            <li><a href=""><span>摄影摄像</span></a></li>
                            <li><a href=""><span>影音智能</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">时尚</a>
                        <ul>
                            <li><a href=""><span>美妆</span></a></li>
                            <li><a href=""><span>服饰</span></a></li>
                            <li><a href=""><span>健身</span></a></li>
                            <li><a href=""><span>T台</span></a></li>
                            <li><a href=""><span>风尚标</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">广告</a></li>
                    <li><i><span>999+</span></i><a href="">娱乐</a>
                        <ul>
                            <li><a href=""><span>综艺</span></a></li>
                            <li><a href=""><span>明星</span></a></li>
                            <li><a href=""><span>Korea相关</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">游戏</a>
                        <ul>
                            <li><a href=""><span>单机游戏</span></a></li>
                            <li><a href=""><span>电子竞技</span></a></li>
                            <li><a href=""><span>手机游戏</span></a></li>
                            <li><a href=""><span>网络游戏</span></a></li>
                            <li><a href=""><span>桌游棋牌</span></a></li>
                            <li><a href=""><span>GMV</span></a></li>
                            <li><a href=""><span>音游</span></a></li>
                            <li><a href=""><span>Mugen</span></a></li>
                            <li><a href=""><span>游戏赛事</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">鬼畜</a>
                        <ul>
                            <li><a href=""><span>鬼畜调教</span></a></li>
                            <li><a href=""><span>音MAD</span></a></li>
                            <li><a href=""><span>人力VOCALOID</span></a></li>
                            <li><a href=""><span>教程演示</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">生活</a>
                        <ul>
                            <li><a href=""><span>搞笑</span></a></li>
                            <li><a href=""><span>日常</span></a></li>
                            <li><a href=""><span>美食圈</span></a></li>
                            <li><a href=""><span>动物圈</span></a></li>
                            <li><a href=""><span>手工</span></a></li>
                            <li><a href=""><span>绘画</span></a></li>
                            <li><a href=""><span>运动</span></a></li>
                            <li><a href=""><span>其他</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">影视</a>
                        <ul>
                            <li><a href=""><span>影视杂谈</span></a></li>
                            <li><a href=""><span>影视剪辑</span></a></li>
                            <li><a href=""><span>短片</span></a></li>
                            <li><a href=""><span>预告·资讯</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">放映</a>
                        <ul>
                            <li><a href=""><span>纪录片</span></a></li>
                            <li><a href=""><span>电影</span></a></li>
                            <li><a href=""><span>电视剧</span></a></li>
                        </ul>
                    </li>
                    <li><i><span>999+</span></i><a href="">直播</a></li>
                    <li><i><span>999+</span></i><a href="">专题</a></li>
                    <li><i><span>999+</span></i><a href="">广场</a></li>
                    <li><i><span>999+</span></i><a href="">梦界</a></li>
                </ul>
            </div>
            <!--    分块-->
            <!--    第一分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon"></div>
                    <div class="splice_nav_first">
                        <a href=""><span>番&nbsp;剧</span></a>
                        <ul class="splice_update_time">
                            <li><a href="javascript:" name="0" @click="getVideoByDate">全部</a></li>
                            <li><a href="javascript:" name="1" @click="getVideoByDate">周一</a></li>
                            <li><a href="javascript:" name="2" @click="getVideoByDate">周二</a></li>
                            <li><a href="javascript:" name="3" @click="getVideoByDate">周三</a></li>
                            <li><a href="javascript:" name="4" @click="getVideoByDate">周四</a></li>
                            <li><a href="javascript:" name="5" @click="getVideoByDate">周五</a></li>
                            <li><a href="javascript:" name="6" @click="getVideoByDate">周六</a></li>
                            <li><a href="javascript:" name="7" @click="getVideoByDate">周天</a></li>
                        </ul>
                        <span class="rank">排行榜</span>
                        <div class="more">
                            <a href=""><span>更多 &gt;</span></a>
                        </div>
                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main" style="height: 500px; background-color: white">
                    <!--            一号卡片使用-->
                    <div class="main_left" id="show">

                        <div class="card" v-for="video in videos">
                            <a :href="video.videoUrl" class="card_img"><img :src="video.videoFace" alt=""></a>
                            <div style="height: 5px;width: 100%;"></div>
                            <div class="card_details">
                                <a :href="video.videoUrl"><span :title="video.videoName">{{video.videoName}}</span></a>
                                <p>{{video.videoStatus}}：<span>{{video.videoNew}}</span></p>
                            </div>
                        </div>


                    </div>
                    <div class="main_right" style="background-color: white">
                        <div class="rank_main">
                            <div class="rank_contain" v-for="(videoRank,index) in videoRanks">
                                <!--                        详情卡片-->
                                <transition
                                        name="custom-classes-transition"
                                        enter-active-class="animated fadeIn"
                                        :duration="{enter:1000,leave:0}"
                                >
                                    <div class="details_contain" v-if="videoRank.show">
                                        <div class="contain_head">
                                            <div class="head_left">
                                                <img :src="videoRank.videoFace" alt="">
                                            </div>

                                            <div class="head_right">
                                                <p>{{videoRank.videoDetails}}</p>
                                            </div>
                                        </div>
                                        <div class="contain_foot">
                                            <div class="foot_left">
                                                <span><i class="glyphicon glyphicon-thumbs-up"></i>{{videoRank.videoGood}}</span>
                                            </div>
                                            <div class="foot_right">
                                                <span><i class="glyphicon glyphicon-facetime-video"></i>{{videoRank.videoCount}}</span>
                                            </div>
                                        </div>
                                    </div>
                                </transition>

                                <span :style="videoRank.active">{{videoRank.videoRank}}</span>
                                <a :href="videoRank.videoUrl" @mouseenter="mouseEnter(index)"
                                   @mouseleave="mouseLeave(index)">
                                    <p>{{videoRank.videoDetails}}</p>
                                </a>
                            </div>


                        </div>

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">
                    <a href=""> <img src="@/assets/images/广告1.jpg" alt="广告1"></a>
                </div>
            </div>
            <!--第二分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon1"></div>
                    <div class="splice_nav_first">
                        <a href=""><span>国&nbsp;创</span></a>
                        <ul class="splice_update_time">
                            <li><a href="javascript:" name="0" @click="getVideo1ByDate">全部</a></li>
                            <li><a href="javascript:" name="1" @click="getVideo1ByDate">周一</a></li>
                            <li><a href="javascript:" name="2" @click="getVideo1ByDate">周二</a></li>
                            <li><a href="javascript:" name="3" @click="getVideo1ByDate">周三</a></li>
                            <li><a href="javascript:" name="4" @click="getVideo1ByDate">周四</a></li>
                            <li><a href="javascript:" name="5" @click="getVideo1ByDate">周五</a></li>
                            <li><a href="javascript:" name="6" @click="getVideo1ByDate">周六</a></li>
                            <li><a href="javascript:" name="7" @click="getVideo1ByDate">周天</a></li>
                        </ul>
                        <span class="rank">排行榜</span>
                        <div class="more">
                            <a href=""><span>更多 &gt;</span></a>
                        </div>
                    </div>


                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main" style="height: 500px; background-color: white">
                    <div class="main_left">
                        <div class="card" v-for="video in videos1">
                            <a :href="video.videoUrl" class="card_img" @click="goToVideo(index)"><img
                                    :src="video.videoFace" alt=""></a>
                            <div style="height: 5px;width: 100%;"></div>
                            <div class="card_details">
                                <a :href="video.videoUrl" @click="goToVideo(index)"><span :title="video.videoName">{{video.videoName}}</span></a>
                                <p>{{video.videoStatus}}:<span>{{video.videoNew}}</span></p>
                            </div>
                        </div>
                    </div>
                    <div class="main_right" style="background-color: white">
                        <div class="rank_main">
                            <div class="rank_contain" v-for="(videoRank,index) in videoRanks1">
                                <!--                        详情卡片-->
                                <transition
                                        name="custom-classes-transition"
                                        enter-active-class="animated fadeIn"
                                        :duration="{enter:1000,leave:0}"
                                >
                                    <div class="details_contain" v-if="videoRank.show">
                                        <div class="contain_head">
                                            <div class="head_left">
                                                <img :src="videoRank.videoFace" alt="">
                                            </div>

                                            <div class="head_right">
                                                <p>{{videoRank.videoDetails}}</p>
                                            </div>
                                        </div>
                                        <div class="contain_foot">
                                            <div class="foot_left">
                                                <span><i class="glyphicon glyphicon-thumbs-up"></i>{{videoRank.videoGood}}</span>
                                            </div>
                                            <div class="foot_right">
                                                <span><i class="glyphicon glyphicon-facetime-video"></i>{{videoRank.videoCount}}</span>
                                            </div>
                                        </div>
                                    </div>
                                </transition>
                                <span :style="videoRank.active">{{videoRank.videoRank}}</span>
                                <a :href="videoRank.videoUrl" @mouseenter="mouseEnter1(index)"
                                   @mouseleave="mouseLeave1(index)">
                                    <p>{{videoRank.videoDetails}}</p>
                                </a>
                            </div>


                        </div>

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">
                    <a href=""> <img src="@/assets/images/kfc广告2.jpg" alt="广告1"></a>
                </div>
            </div>
            <!--第三分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon2"></div>
                    <div class="splice_nav_first">
                        <a href=""><span>音&nbsp;乐</span></a>
                        <span class="rank" style="position: relative;left: 63%;">排行榜</span>
                        <div class="more">
                            <a href=""><span>更多 &gt;</span></a>
                        </div>
                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main" style="background-color: white">
                    <div class="main_left">
                        <!--                二号卡片-->
                        <div class="card_second" v-for="(music,index) in musics">
                            <a :href="music.musicUrl"><img :src="music.musicFace" alt=""></a>
                            <div class="music_contain">
                                <a :href="music.musicUrl"><span
                                        :title="music.musicTitle">{{music.musicTitle}}</span></a>
                                <p>发布时间:<span>{{music.musicTime}}</span></p>
                            </div>
                        </div>


                    </div>
                    <div class="main_right" style="background-color: white">
                        <div class="rank_main">

                            <div class="rank_contain adjustment_third" v-for="(musicRank,index) in musicRanks">
                                <!--                        详情卡片-->
                                <transition
                                        name="custom-classes-transition"
                                        enter-active-class="animated fadeIn"
                                        :duration="{enter:1000,leave:0}"
                                >
                                    <div class="details_contain" v-if="musicRank.show">
                                        <div class="contain_head">
                                            <div class="head_left">
                                                <img :src="musicRank.musicFace" alt="">
                                            </div>

                                            <div class="head_right">
                                                <p>{{musicRank.musicDetails}}</p>
                                            </div>
                                        </div>
                                        <div class="contain_foot">
                                            <div class="foot_left">
                                                <span><i class="glyphicon glyphicon-thumbs-up"></i>{{musicRank.musicGood}}</span>
                                            </div>
                                            <div class="foot_right">
                                                <span><i class="glyphicon glyphicon-facetime-video"></i>{{musicRank.musicCount}}</span>
                                            </div>
                                        </div>
                                    </div>
                                </transition>
                                <span :style="musicRank.active">{{musicRank.musicRank}}</span>
                                <a :href="musicRank.musicUrl" @mouseenter="mouseEnter2(index)"
                                   @mouseleave="mouseLeave2(index)">
                                    <p>{{musicRank.musicTitle}}</p>
                                </a>
                            </div>


                        </div>

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">
                    <a href=""> <img src="@/assets/images/广告3.jpg" alt="广告3"></a>
                </div>
            </div>
            <!--第四分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon3"></div>
                    <div class="splice_nav_first">
                        <a href="" style="width: 25%"><span>更多精彩分区还有待开发</span></a>
                        <span class="rank" style="position: relative;left: 46%;">排行榜</span>
                        <div class="more">
                            <a href=""><span>更多 &gt;</span></a>
                        </div>


                    </div>
                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main">
                    <div class="main_left">

                    </div>
                    <div class="main_right">

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">

                </div>
            </div>
            <!--第五分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon4">

                    </div>
                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main">
                    <div class="main_left">

                    </div>
                    <div class="main_right">

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">

                </div>
            </div>
            <!--第六分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon5">

                    </div>
                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main">
                    <div class="main_left">

                    </div>
                    <div class="main_right">

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">

                </div>
            </div>
            <!--第七分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon6">

                    </div>
                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main">
                    <div class="main_left">

                    </div>
                    <div class="main_right">

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">

                </div>
            </div>
            <!--第八分块-->
            <div class="splice">
                <div class="splice_head">
                    <div class="icon icon7">

                    </div>
                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_main">
                    <div class="main_left">

                    </div>
                    <div class="main_right">

                    </div>

                </div>
                <div style="height: 20px;width: 100%;"></div>
                <div class="splice_foot">

                </div>
            </div>
        </div>
    </div>
    <!--底部-->
    <div class="b_floor">
        <div class="l_wrapper">
            <div class="m_unit_b2">
                <div class="footerInfo">
                    <ul class="weima">
                        <li>
                            <img src="@/assets/images/微信图片_20191203160630.jpg" width="77" height="77">
                            <p>梦界公众号</p>
                        </li>
                        <li>
                            <img src="@/assets/images/1575360967.png" width="72" height="72" style="margin-top: 5px;">
                            <p>APP体验不一样的梦界</p>
                        </li>
                    </ul>
                    <p>
                        <a data-trace="页面底部|页面底部_点击|页面底部_关于游侠客" rel="nofollow" href="javascript:void (0)"
                           target="_blank">关于梦界</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_游侠客的故事" rel="nofollow" href="javascript:void (0)"
                           target="_blank">制作组的故事</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_联系游侠客" rel="nofollow" href="javascript:void (0)"
                           target="_blank">联系制作组</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_游侠客招聘" rel="nofollow" href="javascript:void (0)"
                           target="_blank">制作组招聘</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_意见反馈" rel="nofollow" href="javascript:void (0)"
                           target="_blank">意见反馈</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_使用协议" rel="nofollow" href="javascript:void (0)"
                           target="_blank">使用协议</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_隐私政策" rel="nofollow" href="javascript:void (0)"
                           target="_blank">隐私政策</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_交换链接" rel="nofollow" href="javascript:void (0)"
                           target="_blank">交换链接</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_帮助中心" rel="nofollow" href="javascript:void (0)"
                           target="_blank">帮助中心</a>
                        <a data-trace="页面底部|页面底部_点击|页面底部_网站地图" rel="nofollow" href="javascript:void (0)"
                           target="_blank">网站地图</a>
                    </p>
                    <p>
                        <span>京ICP备 09011712 号-1</span>
                        <span>京公网安备 33010602002306号</span>
                        <span><a href="javascript:void (0)" rel="nofollow" target="_blank">营业执照</a></span>
                        <span>北京梦界网络传媒有限公司</span>
                        <span>北京梦界动漫产业有限公司</span>
                        <span>许可证编号：L-ZJ-CJ00192</span>
                    </p>
                    <p>© 2019 dreamland.com 版权所有法律顾问：北京梦界集团律师事务所 潘静文 北京市漫画制作人联系电话：0571-96123
                        投诉及紧急事件联系电话：400-670-6300转5</p>
                    <p>漫画资讯电话(免长途费)：400-670-6300，公司总部地址：北京市朝阳区教工路198号京商大创业园D幢3楼，投诉建议邮箱：jianyi@youxiake.com</p>
                </div>
                <!--            <div class="friendLines">-->
                <!--                <div class="footerImages clearfix foot-ext">-->
                <!--                    <a href="javascript:;" rel="nofollow" title="不良信息举报中心" class="footer-ext-s2"></a>-->
                <!--                    <a href="javascript:;" rel="nofollow" title="瑞信安全认证" class="footer-ext-s3"></a>-->
                <!--                    <a href="javascript:;" rel="nofollow"  title="12321垃圾信息举报中心" class="footer-ext-s4"></a>-->
                <!--                    <a href="javascript:;" rel="nofollow">-->
                <!--                        <img width="116" height="47" src="https://img3.youxiake.com/static/images/alipay201305.png" alt="支付宝">-->
                <!--                    </a>-->
                <!--                    <a href="javascript:;" rel="nofollow"  title="网络110报警服务" class="footer-ext-s5"></a>-->
                <!--                    <a href="javascript:;" rel="nofollow"  title="网上标识信息" class="footer-ext-s6"></a>-->
                <!--                    <a href="javascript:;" rel="nofollow"  title="全球中文论坛100强" class="footer-ext-s7"></a>-->
                <!--                    <a target="cyxyv" href="https://v.yunaq.com/certificate?domain=bbs.youxiake.com&amp;from=label&amp;code=90020">-->
                <!--                        <img src="https://aqyzmedia.yunaq.com/labels/label_sm_90020.png">-->
                <!--                    </a>-->
                <!--                </div>-->
                <!--            </div>-->
            </div>
            <a href="javascript:" name="floor">&nbsp;</a>
        </div>
    </div>
</div>
</template>
<script setup>
let hotVideo1 = {
  hotName: '',
  hotPic: '',
  hotUrl: '',
}
let hotVideo2 = {
  hotName: '',
  hotPic: '',
  hotUrl: '',
}
let hotVideo3 = {
  hotName: '',
  hotPic: '',
  hotUrl: '',
}
</script>